<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
        <!-- Apple devices fullscreen -->
        <meta name="apple-mobile-web-app-capable" content="yes">
        <!-- Apple devices fullscreen -->
        <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
        <title>本地图片</title>
        <link rel="stylesheet" type="text/css" href="/public/plugins/uploadimgnew/layui/css/layui.css?v=v1.6.7">
        <link rel="stylesheet" type="text/css" href="/public/plugins/uploadimgnew/css/image-upload.css?v=v1.6.7">
        <link href="/public/static/admin/font/css/font-awesome.min.css?v=v1.6.7" rel="stylesheet" />
                    <link href="/public/static/admin/css/theme_style.css?v=v1.6.7_1720001269" rel="stylesheet" type="text/css">
                <script type="text/javascript" src="/public/static/common/js/jquery.min.js?v=v1.6.7"></script>
        <script type="text/javascript" src="/public/plugins/layer-v3.1.0/layer.js?v=v1.6.7"></script>
        <script type="text/javascript" src="/public/plugins/uploadimgnew/layui/layui.js?v=v1.6.7"></script>
        <script type="text/javascript" src="/public/plugins/uploadimgnew/js/jquery.cookie.js?v=v1.6.7"></script>
        <script type="text/javascript">
            var eyou_basefile = "/login.php";
            var module_name = "admin";
            var __root_dir__ = "";
            var __lang__ = "cn";
        </script>
        <style type="text/css">
            #layui-laydate1.layui-laydate{
                right: 7px;
                left: unset !important;
            }
        </style>
        
        
        <link href="css/index.css" rel="stylesheet" type="text/css" />
    <script src="js/vue.min.js"></script>
    <script src="js/vue-resource.min.js"></script>
    <script src="js/index.js"></script>
        <style>
           
            .upload-body .upload-con .image-header .image-header-l .layui-btn {
  background: #3398cc !important;
  border-color: #3398cc !important;
  color:#fff !important;
}
.upload-body .upload-con .image-header .image-header-l .layui-btn i.layui-icon{color:#fff !important;}

.upload-body .upload-con .images-con .img-about{
    left: 100px;
}
.el-upload-list__item-name{display:none !important}

        </style>
        
    </head>

    <body>
        <div class="upload-box ui-layout-center" id="app">
            <div class="upload-body">
                <div class="upload-main">
                    <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
                        <div class="layui-tab-content" style="height: 100%;">
                            <div class="layui-tab-item layui-show"  id="bendi_cont">
                                <div class="upload-con" style="overflow-y: auto;">
                                    <div class="images-con">
                                        <div class="image-header">
                                            <div class="image-header-l"  id="topbar">
                                                <!--<button type="button" @click.prevent="uploadsfile()" class="addfile layui-btn layui-btn-normal"><i class="layui-icon layui-icon-upload-drag"></i><span class="text addfiletext">上传图片</span></button>-->
                                                
                                                <el-upload
                                                  class="upload-demo"
                                                  action="uploadsfile.php"
                                                  :on-change="uploadsfile"
                                                  :file-list="fileList">
                                                  <el-button class="addfile layui-btn layui-btn-normal" size="small" type="primary"><i class="layui-icon layui-icon-upload-drag"></i><span class="text addfiletext">上传图片</span></el-button>
                                                 
                                                </el-upload>
                                                
                                                
                                                
                                                
                                                <div class="img-about">
                                                    <span class="tag-left"></span>
                                                    <span class="text">存储于本地服务器，建议&lt;2M</span>
                                                </div>
                                            </div>
                                            <form id="searchForm" action="/login.php?m=admin&c=Uploadimgnew&a=get_upload_list&lang=cn" method="get" onsubmit="layer_loading('正在处理');">
                                                <input type="hidden" name="m" value="admin"><input type="hidden" name="c" value="Uploadimgnew"><input type="hidden" name="a" value="get_upload_list"><input type="hidden" name="lang" value="cn">                                               
                                                
                                               
                                                
                                                
                                                
                                                
                                            </form>
                                            
                                            
                                            <div class="image-pages-r">
                                                <div id="page">
                                                    <div class='dataTables_paginate paging_simple_numbers'>
                                                    
                                                        <el-pagination
                                                          background
                                                          layout="prev, pager, next"
                                                          @current-change="handleCurrentChange"
                                                          :total="count">
                                                        </el-pagination>
                                                    
                                                    </div>
                                                    
                                                    
                                                </div>
                                            </div>
                                            
                                        </div>
                                                <ul class="image-list" id="file_list" >
                                                    <li v-for="vlist in list" @click.prevent="checkstatus(vlist.img_id)" :data-img="vlist.image_url" :data-title="vlist.title" :data-id="vlist.img_id">
                                                        <div class="picbox">
                                                            <img :src="vlist.image_url">
                                                            <div class="image-select-layer">
                                                                <i class="layui-icon layui-icon-ok-circle"></i>
                                                            </div>
                                                        </div>
                                                        <div class="namebox" style="height: 15px;">
                                                            <span class="eyou_imgtime">{{vlist.title}}</span>
                                                            <span class="eyou_imgname">{{vlist.width}} x {{vlist.height}}</span>
                                                        </div>
                                                        <div class="tools layer">
                                                            <i class="layui-icon layui-icon-close-fill close" @click.prevent="delimg(vlist.img_id)"></i>
                                                        </div>
                                                    </li>
                                                    
                                                </ul>
                                                                                <div class="image-pages">
                                            <div class="image-pages-l">
                                                <button type="button" class="layui-btn layui-btn-primary layui-btn-sm removeall" onclick="batch_delimg(this);" style="display: none;">删除选中(0)</button>
                                            </div>
                                            
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            var type_id = 0;
            var UploadUpUrl = "/login.php?m=admin&c=Ueditor&a=imageUp&savepath=allimg&pictitle=banner&dir=images&is_water=1&lang=cn&unneed_syn=";
            var callback = "img_call_back";
            var num = 1;
            var upload_num = num;
            if (num == 1) {
                upload_num = 100;
            }
            var input = "";
            var image_accept = "image/jpg,image/gif,image/png,image/bmp,image/jpeg,image/ico,image/webp";
            var countimg = 76;
            var eytime = "";
        </script>
        <script type="text/javascript" src="/public/plugins/uploadimgnew/js/get_upload_list.js?v=v1.6.7"></script>
        
        
        
<script>
    var vm = new Vue({
		el: '#app',
		data: {
            list:[],
            count:0,
            id:0,
            file:"",
            fileList:[]
		},
		created(){
		  //  let url=window.location.search;
		  //  let urlParams = new URLSearchParams(url);
		  //  this.id=urlParams.get("id");

		  //  this.searchtext=urlParams.get("searchtext");
		    

		    this.uploadslist();
		},
		mounted(){
		    
		},
		methods: {
		    uploadslist:function(){
		        this.$http.get('api/uploadslist.php').then(function(res){
                    console.log(res.body);   
                    this.list=res.body.data;
                    this.count=res.body.total;
                },function(){
                    console.log('请求失败处理');
                });
		    },
		    handleCurrentChange:function(p){
			    
                if(this.searchstatus){
                    this.$http.post('api/uploadslist.php',{
    			        page:p,
    			        select:this.searchstatus,
    			        text:this.search
    			    },{emulateJSON: true}).then(function(res){
    			        this.list=res.body.data;
                        this.count=res.body.total;
    			    },function(){
    			        console.log("request fail");
    			    })
                }else{
                    this.$http.post('api/uploadslist.php',{
    			        page:p
    			    },{emulateJSON: true}).then(function(res){
    			        this.list=res.body.data;
                        this.count=res.body.total;
    			    },function(){
    			        console.log("request fail");
    			    })
                }
    			    
			},
			delimg:function(id){
			    this.$http.post('api/uploadslist.php',{
			        id:id
			    },{emulateJSON: true}).then(function(res){
			        
			    },function(){
			        console.log("request fail");
			    })
			},
			uploadsfile:function(file, fileList){
			    this.fileList = fileList.slice(-3);
			},
			checkstatus:function(id){
			    if($(".layui-icon.layui-icon-ok-circle")){
			        localStorage.setItem('uploads_img_id', id);
			    }
			}
		}
	})
</script>
        
        
        
        
        
    </body>
</html>
